import Math2D from '../../src/maths/Math2D';
import TestApplication from "./TestApplication";
import ELayout from "../../src/enums/ELayout";

let canvas: HTMLCanvasElement = document.getElementById('canvas') as HTMLCanvasElement;
let context2D: CanvasRenderingContext2D = canvas.getContext('2d') as CanvasRenderingContext2D;
let app: TestApplication = new TestApplication(canvas);
const width: number = 80, heigth: number = 50;
const coordWidth: number = width * 1.2, coordHeight: number = heigth * 1.2;
const radius: number = 5;
export default function main(): void {
    // app.start();
    // app.doTransform0();
    // app.drawCanvasCoordCenter();
    // app.graphic.strokeGrid();
    // testFillLocalRectWithTitle();

    app.graphic.strokeGrid();
    app.graphic.fillCircle(0, 0, radius);
    app.graphic.fillLocalRectWithTitle(width, heigth, '1、初始状态');

    context2D.translate(canvas.width * 0.5, 10);
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    app.graphic.fillCircle(0, 0, radius);
    app.graphic.fillLocalRectWithTitle(width, heigth, '2、平移');

    context2D.translate(0, canvas.height * 0.5 - 10);
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    app.graphic.fillCircle(0, 0, radius);
    app.graphic.fillLocalRectWithTitle(width, heigth, '3、平移到画布中心');

    context2D.rotate(Math2D.toRadian(-120));
    app.graphic.fillLocalRectWithTitle(width, heigth, '4、旋转-120度');
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    app.graphic.fillCircle(0, 0, radius);

    context2D.rotate(Math2D.toRadian(-130));
    app.graphic.fillLocalRectWithTitle(width, heigth, '5、旋转-130度');
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    app.graphic.fillCircle(0, 0, radius);

    context2D.translate(100, 100);
    app.graphic.fillLocalRectWithTitle(width, heigth, '6、局部平移100个单位');
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);

    context2D.scale(1.5, 2.0);
    app.graphic.fillLocalRectWithTitle(width, heigth, '7、x局部放大1.5倍，y轴局部放大2倍', ELayout.LEFT_MIDDLE);
    app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    app.graphic.fillCircle(0, 0, radius);

    // app.graphic.fillLocalRectWithTitle(width*1.5, heigth*2, '8、放大物体尺寸');
    // app.graphic.strokeCoord(0, 0, coordWidth, coordHeight);
    // app.graphic.fillCircle(0, 0, radius);
}

function testFillLocalRectWithTitle(): void {
    if (context2D !== null) {
        // 旋转0°,坐标原点位于左上角(默认)
        app.rotateTranslate(0, ELayout.LEFT_TOP);
        // 顺时针旋转,使用4种不同的ELayout值
        app.rotateTranslate(10, ELayout.LEFT_MIDDLE);
        app.rotateTranslate(20, ELayout.LEFT_BOTTOM);
        app.rotateTranslate(30, ELayout.CENTER_TOP);
        app.rotateTranslate(40, ELayout.CENTER_MIDDLE);
        app.rotateTranslate(-10, ELayout.CENTER_BOTTOM);
        app.rotateTranslate(-20, ELayout.RIGHT_TOP);
        app.rotateTranslate(-30, ELayout.RIGHT_MIDDLE);
        app.rotateTranslate(-40, ELayout.RIGHT_BOTTOM);
        // 计算半径
        let radius: number = app.distance(0, 0, app.canvas.width * 0.5, app.canvas.height * 0.5);
        // 最后绘制一个圆
        app.graphic.strokeCircle(0, 0, radius, 'black');
    }
}